﻿<html lang="zh-cn">   
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit|ie-stand|ie-comp" />
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>
        登录虎扑体育社区
    </title>
     <link href="/HomeCss/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="{{asset('/HomeCss/login/css/reset.css')}}">
    <link rel="stylesheet" href="{{asset('/HomeCss/login/css/passport.css')}}">
    <link rel="stylesheet" href="{{asset('/HomeCss/login/css/passport-index.css')}}">
    <script src="{{asset('/HomeCss/login/js/md5.js')}}">
    </script>
    <script src="{{asset('/HomeCss/login/js/cookie.js')}}"></script>
    <script src="{{asset('/HomeCss/login/js/gt.js')}}"></script>
    <style type="text/css">
        .hidden{width:378px;height:23px;border:1px solid #F5D7D7;background-color:#F5D7D7;color:red;line-height:23px;display:none;}
    </style>
</head>       
<body class="">
    <div class="bg-img">
        <img src="{{asset('/HomeCss/login/picture/bg.jpg')}}" alt="">
    </div>
    <div class="user-login">
        <div class="back-title">
            <a href="#" id='back'>
                <b>
                    返回上页
                </b>                             
            </a>
        </div>
        <div class="login-wrap">
            <div class="row" style="top:50px;left:35%;width:50%;margin: 0 auto;">
                <div class="col-lg-6">
                    @if(session('success'))
                        <div class="alert alert-success alert-dismissable">
                            <button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
                            {{session('success')}}
                        </div>
                    @endif
                    @if(session('error'))
                        <div class="alert alert-danger alert-dismissable">
                            <button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
                            {{session('error')}}
                        </div>
                    @endif
                </div>
            </div>
            <div class="logo">
                <img src="{{asset('/HomeCss/login/picture/logo.png')}}" alt="">
            </div>
            <!-- 登录名、邮箱、手机+密码登录 -->
            <form class="common-form login-form" action="{{url('/home/login/dologin')}}" id="J_loginForm" autocomplete="off" method="post">
                <ul>
                    <li>
                        <div class="ipt-wrap">
                            <input autocomplete="off" type="text" name="username" placeholder="登录名/手机号/邮箱"
                            data-rule="empty" data-name="帐号" id="J_username" tabindex="1">
                            <div class='hidden' >ervfre</div>
                        </div>
                    </li>
                    <li id="J_insertVali">
                        <div class="ipt-wrap">
                            <input autocomplete="off" type="password" name="password" placeholder="密码"
                            data-rule="empty" data-name="密码" id="J_pwd" tabindex="2">
                            <div class='hidden'>efefe</div>
                        </div>
                    </li>
                    <li class="clearfix sp-item">
                        <a href="{{url('/home/login/find/')}}"
                        class="forget-btn fl">
                            忘记密码？
                        </a>
                        <a href="{{url('/home/login/regist/')}}"
                        class="register-btn fr">                            
                            <b>
                                没有帐号，立即注册
                            </b>
                        </a>
                    </li>
                    <li>
                        <div id="float-captcha">
                        </div>
                    </li>
                    <li>
                        {{csrf_field()}}
                        <input type="submit" class="submit-btn" id="J_submit" value="登录">
                    </li>
                </ul>
            </form>
            
        </div>
    </div>
    </div>
    
    <script src="{{asset('/HomeCss/login/js/require.js')}}"></script>
    <script src="{{asset('/HomeCss/regist/js/jquery-1.8.3.min.js')}}"></script>
    <script type="text/javascript">
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
        //返回上一页
        $('#back').click(function(){
            history.back();
            return false;
        });

        //表单验证
        //声明全局变量
        var NAME = false;
        var CPASS = false;
        //绑定表单事件
        $('form').submit(function(){
            //触发所有的丧失焦点事件
            $('input').trigger('blur');
            //判断是否全部成功
            if(NAME && CPASS ){
                return true;                     
            }
            return false;
        });
        //给所有的字段绑定获取焦点事件
        $('input').focus(function(){
            //获取属性 提示信息
            var message = $(this).parent().find('.hidden').html();
        });
        //检查用户输入
        $('input[name=username]').blur(function(){
            var value=$(this).val();
            var name=$(this);
            //检查用户名是否为空
            if($(this).val() == ''){ 
                $(this).next().html('以上输入框内不能为空').css('display','block');      
                return false;
            }else{
                $(this).next().css('display','none');
            }
            //发ajax判断用户是否存在
            $.get('/home/login/exist',{username:value},function(data){
                if(data==1){
                    name.next().css('display','none');
                    NAME=true;
                }else{
                    name.next().html('该用户不存在').css('display','block');
                    return false;
                }
            }) 
        });

        //密码
        $('input[name=password]').blur(function(){
            //判断密码是否为空
            if($(this).val() == ''){ 
                $(this).next().html('密码不能为空').css('display','block');      
                return false;
            } 
            //判断输入密码是否符合要求
            var pass=$(this).val();
            var reg = /\w{6,18}/;       

            if(reg.test(pass)){
                $(this).next().css('display','none');
                
            }else{
                $(this).next().html('密码格式不正确').css('display','block');
                return false;
            }

            //发送ajax判断密码是否正确
            var username=$('input[name=username]').val();
            var password=$(this).val();
            $.post('/home/login/pass',{password:password,username:username},function(data){
                if(data==1){
                    $('input[name=password]').next().css('display','none');
                    CPASS = true;
                }else{
                    $('input[name=password]').next().html('密码或用户名不正确').css('display','block');
                    return false;
                }
            });
        });
    </script>
</body>
    
    </html>